<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ page import="com.mc.lp.view.constants.*;"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="http://www.springframework.org/security/tags" prefix="sec"%>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<div ng-controller="UserAdvanceGraphController as uag" ng-init="uag.init()">
	<div class="modal fade" id="filterModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" data-keyboard="false" data-backdrop="static">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<!-- <button type="button" class="close" data-dismiss="modal">
						<span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
					</button> -->
					<h4 class="modal-title" id="myModalLabel">Filter Graph Data</h4>
				</div>

				<div class="modal-body">
					<form  novalidate>
						<div class="panel panel-default">
							<div class="panel-body">
								<div class="row">
									<div class="col-md-3">
										<b>Chart Type:</b>
									</div>
									<div class="col-md-7">
										<input type="radio" ng-click="uag.setChartType(1)" value="1" name="chartType" checked="checked">Bar Chart
										<input type="radio" ng-click="uag.setChartType(2)" value="2" name="chartType">Line Chart
									</div>
								</div>
								<br />
								<div class="row">
									<div class="col-md-3">
										<b>Select Period:</b>
									</div>
									<div class="col-md-7">
										<input type="radio" ng-click="uag.setPeriodModel(1)" value="1" name="period" checked="checked">Year Wise
										<input type="radio" ng-click="uag.setPeriodModel(2)" value="2" name="period">Term Wise
									</div>
								</div>
								<br />
								<div class="row">
									<div class="col-md-3">
										<b>Select Subjects:</b>
									</div>
									<div class="col-md-9">
										<div class='row'>
											<div class="col-md-4" ng-repeat="i in totalSubjectLoop track by $index">
												<input type="checkbox" ng-click="uag.toggleselectedSubjectList(i.key)" ng-checked="selectedSubjectList.indexOf(i.key) > -1" />{{i.value}}
											</div>
										</div>
									</div>
								</div>
								<br />
								<div class="row">
									<div class="col-md-3">
										<b>Select Grade:</b>
									</div>
									<div class="col-md-9">
										<div class="row">
											<div class="col-md-4" ng-repeat="i in totalGradeLoop track by $index">
												<input type="checkbox" ng-click="uag.toggleGradeSelection(i.key)" ng-checked="selectedGrade.indexOf(i.key) > -1" />{{i.value}}
											</div>
										</div>
									</div>
								</div>
								<br />

								<div class="row" ng-show="periodModel==2">
									<div class="col-md-3">
										<b>Select Term:</b>
									</div>
									<div class="col-md-9">
										<div class="row">
											<div class="col-md-3" ng-repeat="i in terms">
												<input type="checkbox" ng-click="uag.toggleTermSelection(i.key)" ng-checked="selectedTerm.indexOf(i.key) > -1" />{{i.value}}
											</div>
										</div>
									</div>
								</div>
								<br />
							</div>
							<div class="panel-footer"></div>
						</div>
					</form>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" ng-click="uag.applyFliters()">Ok</button>
				</div>
			</div>
		</div>

	</div>

	<!-- Area chart -->
	<div class="box box-primary" style="min-height: 400px">
		<div class="box-header">
			<i class="fa fa-bar-chart-o"></i>
			<div class="section">
				<div class="row">
					<div class="col-md-7 box-title">Advance Graph</div>
					<div class="col-md-3">
						<span class="pull-right"><small><a class="btn-primary" style="color: white !important" href="#" ng-click="userTabCntr.setTabAction(2,'<c:url value="/view/user/templates/user_academic" />')">Student Academic Page&nbsp;</a></small></span>
					</div>
				</div>
			</div>
		</div>
		<div class="box-body">
			<div id="filters">
				<a href="#" ng-click="uag.showFilters()">Options</a>
				<hr>
			</div>
			<div id="advance_chart_div"></div>
		</div>
		<!-- /.box-body-->
	</div>
</div>

